<template>
	<div class="lianxiwmen">
		<toubu></toubu>
		<div class="banner_tou">
			<img src="../assets/img/lianxi.png" />
		</div>
		<div class="lianxiwowen">
			<div class="lianxi1">
				[ 联系我们 ]
			</div>
			<div class="lianxi2">
				<div class="lianxi2_1">
					<img src="../assets/img/shang.png" />
				</div>
				<div class="lianxi2_2">
					<p>联系邮箱</p>
					<p>cooperation@caasdata.com</p>
				</div>
			</div>
			
			<div class="lianxi3">
				<div class="lianxi3_1">
					<img src="../assets/img/zhong.png" />
				</div>
				<div class="lianxi3_2">
					<p>公司地址</p>
					<p>北京市朝阳区东亿国际传媒产业园C-15号楼6F</p>
				</div>
			</div>
			
			<div class="lianxi4">
				<div class="lianxi4_1">
					<img src="../assets/img/xia.png" />
				</div>
				<div class="lianxi4_2">
					<p>联系微信</p>
					<p>
						<img src="../assets/img/kefu.png" />
					</p>
				</div>
			</div>
		</div>
		
		<foot></foot>
	</div>
</template>

<script>
	//头部
	import toubu from "@/components/components/qianzou/header.vue"
	//底部
	import foot from "@/components/components/qianzou/foot.vue"
	export default{
		name:'lianxiwm',
		components:{
			toubu,
			foot
		},
		data(){
			return{
				
			}
		},
		mounted:function(){
			
		}
	}
</script>

<style scoped="scoped" lang="scss">
	.lianxiwmen{
		background-color: #F7F9FF;
		.banner_tou{
			margin-bottom:1% ;
			
			img{
				width: 46.7rem;
			}
		}
		
		.lianxiwowen{
			width: 64%;
			margin: auto;
			border-radius:0.4rem ;
			background-color: #fff;
			position: relative;
			top: -3.2rem;
			
			.lianxi1{
				color: #000;
				font-size: 0.8rem;
				text-align: center;
				padding: 1.5rem 0;
				border-bottom:1px solid #E1E1E1 ;
			}
			.lianxi2{
				margin-top:1.5rem ;
				background: url(../assets/img/top.png) no-repeat;
				background-size:100% 100% ;
				color: #fff;
				
				.lianxi2_1{
					text-align: center;
					padding: 1rem 0;
					// border-bottom: 1px solid #fff;
					
					img{
						width: 1rem;
					}
				}
				.lianxi2_2{
					padding: 0.4rem 0;
					text-align: center;
					
					p:nth-of-type(1){
						font-size: 0.5rem;
						padding:0.4rem 0 ;
					}
					p:nth-of-type(2){
						font-size: 0.4rem;
						padding-bottom:0.3rem ;
					}
				}
			}
			
			.lianxi3{
				margin-top:1.5rem ;
				
				.lianxi3_1{
					text-align: center;
					padding: 1rem 0;
					border-bottom: 1px solid #fff;
					
					img{
						width: 1rem;
					}
				}
				.lianxi3_2{
					padding: 0.4rem 0;
					text-align: center;
					
					p:nth-of-type(1){
						font-size: 0.5rem;
						padding:0.4rem 0 ;
						color: #333333;
					}
					p:nth-of-type(2){
						font-size: 0.4rem;
						padding-bottom:0.3rem ;
						color: #666;
					}
				}
			}
			
			.lianxi4{
				margin-top:1.5rem ;
				background: url(../assets/img/botton.png) no-repeat;
				background-size:100% 100% ;
				margin-bottom:4rem ;
				color: #fff;
				
				.lianxi4_1{
					text-align: center;
					padding: 1rem 0;
					// border-bottom: 1px solid #fff;
					
					img{
						width: 1rem;
					}
				}
				.lianxi4_2{
					padding: 0.4rem 0;
					text-align: center;
					
					p:nth-of-type(1){
						font-size: 0.5rem;
						padding:0.4rem 0 0 0 ;
					}
					p:nth-of-type(2){
						padding-bottom:0.3rem ;
						margin-top:-0.1rem ;
						
						img{
							width: 2rem;
						}
					}
				}
			}
		}
	}
</style>
